<div class="layui-fluid" id="VIEW-list-table" lay-title="信审记录">
    <div class="layui-row layui-col-space10">
        <div class="layui-col-md12">
            <!-- <div class="layui-card">
                <div class="layui-card-header">筛选数据</div>
                <div class="layui-card-body">
                    <form class="layui-form" lay-filter="lig-credit-searchform">
                        
                    </form>
                </div>
            </div> -->
            <div class="layui-card">
                <div class="layui-card-body nepadmin-table-full">
                    <div class="layui-btn-container nepadmin-pad-t10 nepadmin-pad-l10">
                        <div class="layui-btn layui-btn-sm" lay-filter="lig-credit-add">添加申贷</div>
                        <div class="layui-btn layui-btn-sm layui-btn-primary" lay-filter="lig-credit-remove">删除</div>
                    </div>
                    <table lay-filter="lig-credit-table"></table>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/html" id="tpl-row-toolBar">
    <a class="layui-btn layui-btn-primary layui-btn-xs lig-modify" lay-event="lig-modify" title="修改">修改</a>
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="lig-customerInfo" title="客户资料">客户资料</a>
</script>
<script type="text/html" id="tpl-credit-add">
    <form class="layui-form" style="padding: 20px 30px 0 0;" lay-filter="lig-saveForm">
        <div class="layui-form-item">
            <label class="layui-form-label ligui-form-item-required">公司</label>
            <div class="layui-input-inline">
                <input type="hidden" name="customerId">
                <input type="text" name="customerName" class="layui-input layui-disabled" disabled lay-verify="required" value=''>
            </div>
            <div class="layui-form-mid"><a href="javascript:;" lay-filter="lig-choose-customer">选择</a></div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label ligui-form-item-required">申贷状态</label>
            <div class="layui-input-block">
                <select name="status" lay-verify="required">
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label ligui-form-item-required">产品</label>
            <div class="layui-input-block">
                <span style="height: 34px;line-height: 34px;">
                    <i class="layui-icon layui-icon-add-circle" lay-filter="lig-credit-products-item-add" style="font-size: 24px; cursor: pointer;"></i>
                </span>
                <table class="layui-table" lay-skin="nob" lay-size="sm" style="border:0;">
                    <colgroup>
                        <col width="5">
                        <col width="200">
                        <col width="60">
                        <col width="60">
                        <col width="60">
                        <col width="60">
                    </colgroup>
                    <thead>
                        <tr>
                            <th></th>
                            <th>产品</th>
                            <th>金额</th>
                            <th>期限</th>
                            <th>佣金</th>
                            <th>返佣</th>
                        </tr> 
                    </thead>
                    <tbody class="credit-products">
                    </tbody>
                </table>
            </div>
        </div>
        
        <div class="layui-form-item">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <textarea name="remark" class="layui-textarea"></textarea>
            </div>
        </div>
    </form>
</script>
<script type="text/html" id="tpl-credit-modify">
    <form class="layui-form" style="padding: 20px 20px 0 0;" lay-filter="lig-saveForm">
        <input type="hidden" name="id" value="{{d.id}}"/>
        <div class="layui-form-item">
            <label class="layui-form-label ligui-form-item-required">公司</label>
            <div class="layui-input-inline">
                <input type="hidden" name="customerId" value="{{d.customerId}}">
                <input type="text" name="customerName" class="layui-input layui-disabled" disabled lay-verify="required" value="{{d.customerName}}">
            </div>
            <div class="layui-form-mid"><a href="javascript:;" lay-filter="lig-choose-customer">选择</a></div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label ligui-form-item-required">申贷状态</label>
            <div class="layui-input-block">
                <select name="status" lay-data="{{d.status}}" lay-verify="required">
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label ligui-form-item-required">产品</label>
            <div class="layui-input-block">
                <span style="height: 34px;line-height: 34px;">
                    <i class="layui-icon layui-icon-add-circle" lay-filter="lig-credit-products-item-add" style="font-size: 24px; cursor: pointer;"></i>
                </span>
                <table class="layui-table" lay-skin="nob" lay-size="sm" style="border:0;">
                    <colgroup>
                        <col width="5">
                        <col width="200">
                        <col width="60">
                        <col width="60">
                        <col width="60">
                        <col width="60">
                    </colgroup>
                    <thead>
                        <tr>
                            <th></th>
                            <th>产品</th>
                            <th>金额</th>
                            <th>期限</th>
                            <th>佣金</th>
                            <th>返佣</th>
                        </tr> 
                    </thead>
                    <tbody class="credit-products">
                        {{# layui.each(d.products, function(i, it){ }}
                        <tr>
                            <td style="padding-left:0;padding-right:0; text-align:center;">
                                <span style="height: 34px;line-height: 34px;">
                                        <i class="layui-icon layui-icon-reduce-circle" lay-filter="lig-credit-products-item-delete" style="font-size: 20px; cursor: pointer;"></i>
                                    </span>
                            </td>
                            <td>
                                <select name="productId" lay-data="{{it.productId}}">
                                    <option value="">--选择产品--</option>
                                </select>
                            </td>
                            <td style="text-align:right;" class="col-opt">
                                <input type="text" autocomplete="off" class="layui-input" name="amount" value="{{it.amount}}">
                            </td>
                            <td style="text-align:right;">
                                <input type="text" autocomplete="off" class="layui-input" name="deadline" value="{{it.deadline}}">
                            </td>
                            <td style="text-align:right;" class="col-opt">
                                <input type="text" autocomplete="off" class="layui-input" name="brokerage" value="{{it.brokerage}}">
                            </td>
                            <td style="text-align:right;">
                                <input type="text" autocomplete="off" class="layui-input" name="rebate" value="{{it.rebate}}">
                            </td>
                        </tr>
                        {{#  }); }}
                    </tbody>
                </table>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <textarea name="remark" class="layui-textarea">{{d.remark}}</textarea>
            </div>
        </div>
    </form>
</script>
<script type="text/html" id="tpl-credit-product-item">
    <tr>
        <td style="padding-left:0;padding-right:0; text-align:center;">
            <span style="height: 34px;line-height: 34px;">
                    <i class="layui-icon layui-icon-reduce-circle" lay-filter="lig-credit-products-item-delete" style="font-size: 20px; cursor: pointer;"></i>
                </span>
        </td>
        <td>
            <select name="productId">
                <option value="">--选择产品--</option>
                {{# layui.each(d.data, function(i, it){ }}
                <option value="{{it.id}}">{{it.name}} | {{it.bankName}}</option>
                {{#  }); }}
            </select>
        </td>
        <td style="text-align:right;" class="col-opt">
            <input type="text" autocomplete="off" class="layui-input" name="amount">
        </td>
        <td style="text-align:right;">
            <input type="text" autocomplete="off" class="layui-input" name="deadline">
        </td>
        <td style="text-align:right;" class="col-opt">
            <input type="text" autocomplete="off" class="layui-input" name="brokerage">
        </td>
        <td style="text-align:right;">
            <input type="text" autocomplete="off" class="layui-input" name="rebate">
        </td>
    </tr>
</script>
<script>
    var choose_customer, customerInfo = {};
    layui.use(['admin', 'table', 'form', 'dropdown', 'laytpl', 'jquery','lig'], function (admin, table, form, dropdown, laytpl, $, lig) {
        
        var info = function(id) {
            customerInfo.customerId = id;

            var _save = function (data) {
                
                var files = [];
                $('.customerInfo-files .imgbox').each(function() {
                    files.push(lig.getDataJSON($(this)));
                });
                data.files = JSON.stringify(files);

                lig.ajaxpost({
                    url: '/bu/customer/info/modify'
                    , data: data
                    , success: function (res) {
                        layer.closeAll();
                        lig.success('保存成功');
                    }
                });
            };

            admin.popup({
                closeBtn: 1,
                btn: ['保存', '取消'],
                btnAlign: 'r',
                title: '客户资料',
                area: ['80%', '80%'],
                //网页地址或本地目录
                url:'bu/customerInfo'
                ,
                yes: function (index, layero) {
                    $('[lay-filter="lig-save"]').trigger('click');
                    return false;
                },
                end: function () {
                },
                success: function() {
                    $('[lay-filter="lig-saveForm"]').append('<div type="button" style="display: none;" lay-submit lay-filter="lig-save"></div>');
                        form.on('submit(lig-save)', function (data) {
                            _save(data.field);
                            return false;
                        });
                },
                data:{
                    customerId: id,
                }
            });
        }
        
        var selectProduct = function(ele) {
            lig.ajaxget({
                url: 'bu/product/list',
                success: function(result) {
                    if (result.data) {
                        $.each(result.data, function(i, it) {
                            $(ele).each(function() {
                                var value = $(this).attr('lay-data'), selected = '';
                                if (it.id == value) {
                                    selected = 'selected';
                                }
                                $(this).append('<option value="' + it.id + '"' + selected + '>' + it.name + ' | ' + it.bankName + '</option');
                            });
                        });
                        
                        form.render();
                    }
                }
            });
        };

        var addProductItem = function(ele) {
            lig.ajaxget({
                url: 'bu/product/list',
                success: function(result) {
                    if (result.data) {
                        laytpl($('#tpl-credit-product-item').html()).render(result, function (html) {
                            $(ele).append(html);
                            $('[lay-filter="lig-credit-products-item-delete"]').unbind('click').click(function() {
                                $(this).closest('tr').remove();
                            });
                        });
                        form.render();
                    }
                }
            });
        };

        var dataTable = lig.table({
            elem: '[lay-filter="lig-credit-table"]',
            url: 'bu/credit/page',
            cols: [[
                { title: '', type: 'checkbox', fixed: true, width: 60 },
                { title: '操作', toolbar: '#tpl-row-toolBar', align: 'left', width: 160},
                { title: '公司', field: 'customerName', minWidth: 120 },
                { title: '业务员', field: 'salesName', width: 120 },
                { title: '状态', field: 'statusName', width: 120 },
                { title: '备注', field: 'remark', minWidth: 120 },
                { title: '创建时间', field: 'createdTime', minWidth: 120, templet: '<div>{{ layui.util.toDateString(d.createdTime, "yyyy-MM-dd HH:mm:ss") }}</div>', }
            ]]
        },{
            mode:'dialog',
            entity: 'credit',
            primaryField: 'id',
            addContent: $('#tpl-credit-add').html(),
            addUrl: 'bu/credit/add',
            addTitle: '添加申贷',
            area: ['70%', '80%'],
            onAddOpened: function() {
                var _saveForm = '[lay-filter="lig-saveForm"]';
                lig.loadSelectDict('bu_credit_status', _saveForm + ' select[name="status"]');

                addProductItem('.credit-products');

                
                $('[lay-filter="lig-credit-products-item-add"]').unbind('click').click(function() {
                    addProductItem('.credit-products');
                });
            

                $('[lay-filter="lig-choose-customer"]').click(function() {
                    lig.choose({
                        title: '选择公司',
                        url: 'bu/chooseCustomer',
                        onSave: function () {
                        },
                        end: function () {
                            if (choose_customer) {
                                $(_saveForm).find('input[name="customerId"]').val(choose_customer.id);
                                $(_saveForm).find('input[name="customerName"]').val(choose_customer.name);
                            }
                        }
                    });
                });
            },

            modifyContent: $('#tpl-credit-modify').html(),
            modifyUrl: 'bu/credit/modify',
            modifyTitle: '修改申贷',
            onModifyOpened: function() {
                var _saveForm = '[lay-filter="lig-saveForm"]';
                lig.loadSelectDict('bu_credit_status', _saveForm + ' select[name="status"]');

                selectProduct('.credit-products select[name="productId"]');

                $('[lay-filter="lig-credit-products-item-add"]').unbind('click').click(function() {
                    addProductItem('.credit-products');
                });

                $('[lay-filter="lig-credit-products-item-delete"]').unbind('click').click(function() {
                    $(this).closest('tr').remove();
                });


                $('[lay-filter="lig-choose-customer"]').click(function() {
                    lig.choose({
                        title: '选择公司',
                        url: 'bu/chooseCustomer',
                        onSave: function () {
                        },
                        end: function () {
                            if (choose_customer) {
                                $(_saveForm).find('input[name="customerId"]').val(choose_customer.id);
                                $(_saveForm).find('input[name="customerName"]').val(choose_customer.name);
                            }
                        }
                    });
                });
            },

            onSave: function(data) {
                var products = [], isSetLegal = false;
                $('.credit-products > tr').each(function () {
                    var $this = $(this);
                    var data = lig.form2JSON($this);
                    if (!data.productId) {
                        return true;
                    }
                    products.push(data);
                });

                if (products.length == 0) {
                    lig.alert('请选择产品');
                    return false;
                }

                data.products = JSON.stringify(products);
                return data;
            },

            removeUrl: 'bu/credit/remove',
            getUrl: 'bu/credit/{id}',
            onTool: function (obj) {
                var event = obj.event, id = obj.data.customerId;
                if (obj.event == 'lig-customerInfo') {
                    info(id);
                }
            },
        });

        

        form.render();

    });
</script>